<!--
 * @Author: ChunLai
 * @Date: 2022-03-29 17:14:07
 * @LastEditTime: 2025-11-20 14:50:49
 * @Description: 省市区地址选择
 * @FilePath: \01.latest-short-insure\src\components\Address.vue
-->
<template>
  <div class="addr-module bg-fff">
    <van-picker
      v-if="backups.length > 0"
      show-toolbar
      title="请选择地址"
      value-key="label"
      :columns="columns"
      @cancel="cancle"
      :default-index="defaultIndex"
      @confirm="confirm"
    />
    <template v-else>
      <div class="load-css" v-if="hasChildren">
        <van-loading type="spinner" color="#1989fa" size="24px"
          >数据加载中...</van-loading
        >
      </div>
    </template>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  name: "AddressModule",
  data() {
    return {
      backups: [], //数据备份
      province: "请选择省份",
      city: "请选择城市",
      county: "请选择区县",
      tabIndex: 0,
      provinceIndex: "",
      cityIndex: "",
      countyIndex: "",
      provinceCode: "",
      cityCode: "",
      countyCode: "",
      addressDetail: "", //地址拼接详情
      addressCodeList: {
        addressDetail: "",
        provinceCode: "",
        cityCode: "",
        countyCode: "",
        provinceName: "",
        cityName: "",
        countyName: "",
        rgtAddress: "", //省市
        zipCode: "", //邮编
        townNo: "",
        townName: "",
      },
      cityList: "", //暂存的市
      hasChildren: true,
    };
  },
  computed: {
    ...mapGetters({
      provinceNo: "agent/saleProvinceNo",
    }),
    columns() {
      let data = JSON.parse(JSON.stringify(this.backups));
      return data;
    },
    defaultIndex() {
      let index = 0;
      if (this.provinceNo) {
        let sindex = this.columns.findIndex(
          (item) => item.value == this.provinceNo
        );
        if (sindex > 0) {
          index = sindex;
        }
      }

      return index;
    },
  },
  created() {
    this.$store.dispatch("json/getBaseDataJson","area").then((data) => {
      this.backups = data;
    });
  },
  methods: {
    // 确认,关闭弹窗
    confirm(value, data) {
      // console.log(value, data);
      this.addressCodeList.addressDetail = value.join("");
      this.addressCodeList.rgtAddress = value[0] + value[1];
      this.addressCodeList.provinceName = value[0];
      this.addressCodeList.cityName = value[1];
      if (value[2] !== undefined) {
        this.addressCodeList.countyName = value[2];
      }
      if (value[3] !== undefined) {
        this.addressCodeList.townName = value[3];
      }
      this.addressCodeList.provinceCode = this.columns[data[0]].value;
      this.addressCodeList.cityCode =
        this.columns[data[0]].children[data[1]].value;
      if (data[2] !== undefined) {
        this.addressCodeList.countyCode =
          this.columns[data[0]].children[data[1]].children[data[2]].value;
      }
      if (data[3] !== undefined) {
        this.addressCodeList.townNo =
          this.columns[data[0]].children[data[1]].children[data[2]].children[
            data[3]
          ].value;
      }
      // try {
      //   this.addressCodeList.zipCode = findPostCode(
      //     value[0],
      //     value[1],
      //     value[2]
      //   );
      // } catch (error) {}
      this.$emit("addresssConfirm", this.addressCodeList);
    },
    //取消,关闭弹窗
    cancle() {
      this.$emit("cancle");
    },
  },
};
</script>
<style lang="less" scoped>
.load-css {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 120px 0;
}
</style>
